<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>号牌查询</title>
		<%include("/common/include.html"){}%>
		<link rel="stylesheet" href="${cxt!}/sb/plugins/ztree/css/zTreeStyle/zTreeStyle.css" type="text/css">
		<style type="text/css">
		.textbox {
			padding-right: 0px;
			background: url("${cxt !}/sb/themes/insdep/images/combo_arrow.png")
				no-repeat scroll right center transparent;
		}
		</style>
	</head>
	<body class="easyui-layout">
	
		
			<div data-options="region:'north',split: true,title:'快速查询'" style="height:120px;padding:10px;">
				<form id="fineInfoStatisticFrom" action="${cxt!}/customerInfoStatistic/excel">
					<div style="margin-bottom: 10px;float:left;margin-right: 10px;height:30px;line-height:30px;">
						<label class="label-top" style="width: 30px; display: block;float:left;">年月</label>
						
						
						<input id = "month" name="_query.month" value='${date(),dateFormat="yyyy"}' class="easyui-datebox theme-textbox-radius" style="width:120px;height:25px;float:right;"  
						data-options="editable: false,icons:[{
		                        iconCls:'icon-clear',
		                        handler: function(e){
		                            $(e.data.target).datetimespinner('clear');
		                        }
		                    }]"/>
		                   
					</div>
					<div style="margin-bottom: 10px;float:left;margin-right: 10px;height:30px;line-height:30px;">
						<label class="label-top" style="width: 30px; display: block;float:left;">日</label>
						
						<input id="day" name="_query.day" value='${day !}'  class="easyui-numberspinner inputBox theme-textbox-radius"  style="width:120px;height:25px;float:right;"  data-options="increment:1,min:1,max:31,icons:[{
		                        iconCls:'icon-clear',
		                        handler: function(e){
		                            $(e.data.target).datetimespinner('clear');
		                        }
		                    }]""/>
		                    
					</div>
					
					<div style="margin-bottom: 10px;float:left;margin-right: 10px;height:30px;line-height:30px;">
						<label class="label-top" style="width: 30px; display: block;float:left;">车牌</label>
						<input class="easyui-combobox"  style="width:100px;height:25px;float:right;"  id="hphm" name="_query.HPHM"     
							data-options="
							url:'commonUtil/getVehicleInfo',
							method:'post',
							valueField:'hphm',
							textField:'hphm'
							">
					</div>
					<div style="margin-bottom: 10px;float:left;margin-right: 10px;height:30px;line-height:30px;">
						<label class="label-top" style="width: 40px; display: block;float:left;">流水号</label>
							<input class="easyui-combobox"    style="width:160px;height:25px;float:right;"   id="lsh" name="_query.LSH" 
							data-options="
							url:'commonUtil/getVehicleInfo',
							method:'post',
							valueField:'lsh',
							textField:'lsh'
							">
					</div>
					<div style="margin-bottom: 10px;float:left;margin-right: 10px;height:30px;line-height:30px;">
						<label class="label-top" style="width: 80px; display: block;float:left;">身份证明号码</label>
						<input class="easyui-combobox"     style="width:160px;height:25px;"  id="sfzmhm" name="_query.SFZMHM" 
							data-options="
							url:'commonUtil/getVehicleInfo',
							method:'post',
							valueField:'sfzmhm',
							textField:'sfzmhm'
							">
					</div>
					<div>
						<a href="#" onclick='searchFrom()' class="easyui-linkbutton" data-options="iconCls:'icon-search'" style="width:80px;height:25px;margin-top:5px">搜索</a>
						<a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-clear'" style="width:80px;height:25px;margin-top:5px"  onclick="clearsj()">清除</a>
					</div>
					
					</form>
					
			
	   	 	</div>
	   	 	<div data-options="region:'center',border: false" style="overflow-x:hidden;">
	   	 	<div align="center" style="font-size: 15px" >
	   	 	<table  >
	   	 	<tr >
	   	 	<td><span style="color: red;"><b>共计注册：</b></span>${count!}</td>
	   	 	<%for(user in list){%>
	   	 	<td><span style="color: red;"><b>${user.name!}：</b></span>${user.count!}</td>
	   	 	<%}%>
	   	 	</tr>
	   	 	</table>
	   	 	</div>
	   	 	
	   	 	
	   	 	
				<table id="CPHMInfoTable" style="width:100%;height:100%;">
				</table>
	    	</div>
	    	
		<script type="text/javascript">
			
			var $form = $('#fineInfoStatisticFrom');
			function searchFrom(){
				initCPHMInfoTable();
			}
			
			
			
			var columns = [[
							
					  		{field:'ids',title:'ids',width:100,align:'center',hidden:true},
					  		{field:'lsh',title:'注册流水号',width:130,align:'center'},
					  		{field:'sfzmmc',title:'身份证明名称',width:130,align:'center'},
							{field:'sfzmhm',title:'身份证明号码',width:130,align:'center'},
					  		{field:'cllx',title:'车辆类型',width:130,align:'center'},
							{field:'hphm',title:'号牌号码',width:130,align:'center'},
							{field:'zdyzt',title:'状态', align:'center',
								formatter: function(value,row,index){
									if(row.zdyzt == '1'){
										return  '已注册';
									}else
									if(row.zdyzt == '2'){
										return  '已分配车牌';
									}else
									
									if(row.zdyzt == '3'){
										return  '已制证';
									}else  if(row.zdyzt == '4'){
										return  '已归档';
									}else  if(row.zdyzt == '5'){
										return  '已过户';
									}else  if(row.zdyzt == '6'){
										return  '已变更';
									}
								},
								styler: function (value, row, index) {
									if(row.zdyzt == '1'){
										return 'color:green';
									}else
									if(row.zdyzt == '2'){
										return 'color:#5798fc';
									}else
									
									if(row.zdyzt == '3'){
										 return 'color:red';
									}else{
										return 'color:green';
									}
								
						             
						        }
							},
							{field:'clpp1',title:'品牌',width:130,align:'center'},
							{field:'cllx',title:'车辆类型',width:130,align:'center'},
							{field:'clxh',title:'车辆型号',width:130,align:'center'},
							{field:'syr',title:'机动车所有人',width:130,align:'center'},
							{field:'ccdjrq',title:'初次登记日期',width:130,align:'center'},
							{field:'yxqz',title:'检验有效期止',width:130,align:'center'},
							{field:'fprq',title:'发牌日期',width:130,align:'center'},
							{field:'fzrq',title:'发行驶证日期',width:130,align:'center'},
							{field:'zt',title:'状态',width:130,align:'center'},
							
					      ]];
			function initCPHMInfoTable(){
				
				$('#CPHMInfoTable').datagrid({
					
					cls: "theme-datagrid",
					toolbar: '#tb',
					singleSelect: true,
					rownumbers: true, //显示序号
					pagination: true,
					pageSize: 10,
					url: "${cxt!}/cphmStastic/view",
					queryParams: sy.serializeObject($form),
				    method: 'post',
					collapsible: true,
					remoteSort:false,
					multiSort:true,
					columns:columns,
					onLoadSuccess:function(){
						$('#CPHMInfoTable').datagrid("selectRow", 0);
						// 获取主表选中行
					},
					onClickRow:function(rowIndex,rowData){
					}
				});
			}
		
			$(function() {
				
				dateFormatter();
				
				
})

function  dateFormatter()
{
	$('#month').datebox({
	       //显示日趋选择对象后再触发弹出月份层的事件，初始化时没有生成月份层
	       onShowPanel: function () {
	          //触发click事件弹出月份层
	          span.trigger('click'); 
	          if (!tds)
	            //延时触发获取月份对象，因为上面的事件触发和对象生成有时间间隔
	            setTimeout(function() { 
	                tds = p.find('div.calendar-menu-month-inner td');
	                tds.click(function(e) {
	                   //禁止冒泡执行easyui给月份绑定的事件
	                   e.stopPropagation(); 
	                   //得到年份
	                   var year = /\d{4}/.exec(span.html())[0] ,
	                   //月份
	                   //之前是这样的month = parseInt($(this).attr('abbr'), 10) + 1; 
	                   month = parseInt($(this).attr('abbr'), 10);  

				         //隐藏日期对象                     
				         $('#month').datebox('hidePanel').datebox('setValue', year + '-' + month); 
	                 });
	             }, 0);
	        },
	            //配置parser，返回选择的日期
	            parser: function (s) {
	                if (!s) return new Date();
	                var arr = s.split('-');
	                return new Date(parseInt(arr[0], 10), parseInt(arr[1], 10) - 1, 1);
	            },
	            //配置formatter，只返回年月 之前是这样的d.getFullYear() + '-' +(d.getMonth()); 
	            formatter: function (d) { 
	                var currentMonth = (d.getMonth()+1);
	                var currentMonthStr = currentMonth < 10 ? ('0' + currentMonth) : (currentMonth + '');
	                return d.getFullYear() + '-' + currentMonthStr; 
	            }
	        });

	        //日期选择对象
	        var p = $('#month').datebox('panel'), 
	        //日期选择对象中月份
	        tds = false, 
	        //显示月份层的触发控件
	        span = p.find('span.calendar-text'); 
	        var curr_time = new Date();

	        //设置前当月
	        $("#month").datebox("setValue", myformatter(curr_time));
    
 
}
	//格式化日期
	function myformatter(date) {
	    //获取年份
	    var y = date.getFullYear();
	    //获取月份
	    var m = date.getMonth() + 1;
	    return y + '-' + m;
	}
	
	function clearsj(){
		$("#hphm").textbox("clear");
		$("#lsh").textbox("clear");
		$("#sfzmhm").textbox("clear");
		$("#month").datebox("clear");
		$("#day").textbox("clear");
	}

		</script>
	</body>
</html>
